import React, { Component } from 'react'
import { fetchData } from '../../../components/AjaxConsumer'
import {
    Form,
    Input,
    Tooltip,
    Icon,
    Cascader,
    Select,
    Row,
    Col,
    Checkbox,
    Button,
    message,
    Modal,
    Radio,
    InputNumber,
    DatePicker
} from 'antd';
import ListModelDetail from './SearchModel';
import { SelectUrl } from '../../../components';
const FormItem = Form.Item;

class WorkAreaForm extends React.Component {
    state = {
        loading: false,
        isEdit: false,
        submitUrl: '',
        // modelTypeUrl: '/base/dic/get/model_type_p',
        regionCodeUrl: '',
        activeFlagUrl: '/base/dic/get/active_flag',
        formData: {}
    };

    popClick= () => {
        this.refs.listModelDetail.showModal(1);
        // this.refs.listModelDetail.refreshHandle();
    };

    // modelTypeOnChange = (wlCode) => {
    //     if (wlhCode != '' && wlCode != undefined) {
    //         this.setState({
    //             regionCodeUrl: '/base/region/r/' + wlCode + '/region',
    //         });
    //     }
    // }

    // 型号选择弹出模态框的统一回调函数
    getListModelDetailData = (resultData) => {
        // if(resultData.type=='instock'){
        this.props.form.setFieldsValue(
            {
                model: resultData.model,
                // productName: resultData.productName,
                // density: resultData.density,
                // spec: resultData.spec,
            }
        );
    }

    handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFieldsAndScroll((err, fieldsValue) => {
            if (!err) {
                this.setState({ loading: true });
                const planDate = fieldsValue['planDate'];
                let values = {
                    ...fieldsValue,
                    'planDate': fieldsValue['planDate'] ? planDate.format('YYYY-MM-DD HH:mm:ss') : "",
                };
                console.log('表单提交数据-----------', values);
                //发送ajax 控制请求数据规则，无值的设为空
                for (let item in values) {
                    if (!values[item]) {
                        values[item] = ''
                    }
                }
                const options = {
                    url: this.state.submitUrl,
                    type: 'post',
                    condition: values
                };

                fetchData(this,options,
                    (res) => {
                        //成功回调函数
                        this.setState({
                            loading: false
                        });
                        if (res.code == '1') {
                            message.success('操作成功');

                            this.handleCancel();
                            this.props.refreshHandle();
                        } else {
                            //message.error(res.msg);
                        }

                    },
                    () => {
                        this.setState({
                            loading: false
                        });
                    }
                )
            }
        });
    }

    handleCancel = () => {
        this.props.onCancel();//123
        this.props.form.resetFields(); //初始化表单
        //初始化ajax加载过来的selectList
    }

    checkOutAmountNumber = (rule, value, callback) => {
        const form = this.props.form;
        if (value && value > 0) {
            callback();
        } else {
            callback('基本单位数量应为大于0的数字');
        }
    }

    checkInAmountNumber = (rule, value, callback) => {
        const form = this.props.form;
        if (value && value > 0) {
            callback();
        } else {
            callback('转换数量应为大于0的数字');
        }
    }

    //propertity 修改时执行
    componentWillReceiveProps(newProps) {
        this.setState({
            isEdit: newProps.isEdit,
            submitUrl: newProps.submitUrl,
            formData: newProps.formData
        });
    }

    // 组件参数实例化-仅一次
    componentWillMount() {
        this.setState({
            isEdit: this.props.isEdit,
            submitUrl: this.props.submitUrl,
            formData: this.props.formData
        });
    }

    render() {
        const { getFieldDecorator } = this.props.form;
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 6 }
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 18 }
            }
        };
        const tailFormItemLayout = {
            wrapperCol: {
                xs: { span: 24, offset: 0 },
                sm: { span: 24, offset: 10 }
            }
        };

        let objectInfo = this.state.formData;

        return (
            <div>
                <Form
                    onSubmit={this.handleSubmit}
                    style={{
                        backgroundColor: '#fff',
                        paddingTop: '20px',
                        paddingBottom: '20px'
                    }}>
                    <Row>
                        {/* <Col span={0}>
                            <FormItem>
                                {getFieldDecorator('countingTaskId', {
                                    initialValue: objectInfo.countingTaskId ? objectInfo.countingTaskId : "",
                                    rules: [
                                        {}
                                    ]
                                })(<Input type="hidden" />)}
                            </FormItem>
                        </Col> */}
                        <Col span={23}>
                            <FormItem {...formItemLayout} label="型号">
                                {getFieldDecorator('model', {
                                    initialValue: objectInfo.model ? objectInfo.model : "",
                                    rules: [
                                        // {
                                        //     required: true, whitespace: true, message: '型号'
                                        // },
                                        // {
                                        //     max: 100, message: '输入内容应少于100个字符'
                                        // }
                                    ]
                                })(
                                    <Input disabled />
                                )}
                            </FormItem>
                        </Col>
                        <Col span={1} >
                            <Icon
                                className="dynamic-delete-button"
                                type="search"
                                onClick={() => this.popClick()}
                            />
                        </Col>
                        {/* <Col span=   {24}>
                            <FormItem {...formItemLayout} label="型号类型">
                                {getFieldDecorator('modelType', {
                                    initialValue: objectInfo.modelType ? objectInfo.modelType : "",
                                    rules: [
                
                                    ]
                                })(
                                    <SelectUrl url={this.state.modelTypeUrl} type="get" onChange={this.modelTypeOnChange}
                                               dicCode="dicCode" dicName="dicName"/>
                                )}
                            </FormItem>
                        </Col> */}
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="计划时间">
                                {getFieldDecorator('planDate', {
                                    initialValue: objectInfo.planDate ? objectInfo.planDate : "",
                                    rules: [
                                        {
                                            required: true, message: '请选择日期'
                                        }
                                    ]
                                })(
                                    <DatePicker format="YYYY-MM-DD" />
                                )}
                            </FormItem>
                        </Col>
                        {/* <Col span={24}>
                            <FormItem {...formItemLayout} label="转换单位">
                                {getFieldDecorator('inUnit', {
                                    initialValue: objectInfo.inUnit ? objectInfo.inUnit : "",
                                    rules: [
                                        {
                                            required: true, whitespace: true, message: '请输入转换单位'
                                        },{
                                            max:100,message: '输入内容应少于100个字符'
                                        }
                                    ]
                                })(
                                    <Input placeholder="请输入"/>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="基本单位">
                                {getFieldDecorator('outUnit', {
                                    initialValue: objectInfo.outUnit ? objectInfo.outUnit : "",
                                    rules: [
                                        {
                                            required: true, whitespace: true, message: '请输入基本单位'
                                        },{
                                            max:100,message: '输入内容应少于100个字符'
                                        }
                                    ]
                                })(
                                    <Input placeholder="请输入"/>
                                   

                                )}
                            </FormItem>
                        </Col>
                         <Col span={24}>
                            <FormItem {...formItemLayout} label="换算关系">
                                {getFieldDecorator('turnoverRatio', {
                                    initialValue: objectInfo.turnoverRatio ? objectInfo.turnoverRatio : "",
                                    rules: [
                                      
                                    ]
                                })(
                                     <InputNumber step={0.1}  />
                                )}
                            </FormItem>
                        </Col>
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="基本单位数量">
                                {getFieldDecorator('outAmount', {
                                    initialValue: objectInfo.outAmount ? objectInfo.outAmount : "",
                                    rules: [
                                        {
                                            required: true, message: '请输入基本单位数量'
                                        },{
                                           validator: this.checkOutAmountNumber,
                                        }
                                    ]
                                })(
                                     <InputNumber  min={0}/>
                                )}
                            </FormItem>
                        </Col> 
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="转换数量">
                                {getFieldDecorator('inAmount', {
                                    initialValue: objectInfo.inAmount ? objectInfo.inAmount : "",
                                    rules: [
                                        {
                                            required: true, message: '请输入转换数量'
                                        },{
                                            validator: this.checkInAmountNumber,
                                        }
                                    ]
                                })(
                                     <InputNumber  min={0}  />
                                )}
                                
                            </FormItem>
                        </Col>   */}
                        {/* <Col span=   {24}>
                            <FormItem {...formItemLayout} label="仓库编码">
                                {getFieldDecorator('whCode', {
                                    initialValue: objectInfo.whCode ? objectInfo.whCode : "",
                                    rules: [
                                        {
                                            required: true, whitespace: true, message: '请选择仓库编码'
                                        }
                                    ]
                                })(
                                    <SelectUrl url={this.state.modelTypeUrl} type="post" onChange={this.modelTypeOnChange}
                                               dicCode="warehouseCode" dicName="warehouseName"/>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="区域编码" hasFeedback>
                                {getFieldDecorator('regionCode', {
                                    initialValue: objectInfo.regionCode ? objectInfo.regionCode : "",
                                    rules: [
                                        {
                                            required: true, whitespace: true, message: '请选择区域编码'
                                        }
                                    ]
                                })(
                                    <SelectUrl url={this.state.regionCodeUrl} type="post" dicCode="regionCode"
                                               dicName="regionDesc"/>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={24}>
                            <FormItem {...formItemLayout} label="激活标记" hasFeedback>
                                {getFieldDecorator('activeFlag', {
                                    initialValue: objectInfo.activeFlag ? objectInfo.activeFlag : "",
                                    rules: [
                                        {
                                            required: true, whitespace: true, message: '请选择激活标记'
                                        }
                                    ]
                                })(
                                    <SelectUrl url={this.state.activeFlagUrl} type="get" dicCode="dicCode"
                                               dicName="dicName"/>
                                )}
                            </FormItem>
                        </Col> */}
                        <Col span={24} style={{ textAlign: 'center', marginTop: '10px' }}>
                            <Button type="primary" htmlType="submit" size="large">
                                {'确定'}
                            </Button>
                            <Button type="default" style={{ marginLeft: '50px' }} size="large" onClick={this.handleCancel}>
                                取消
                                </Button>
                        </Col>
                    </Row>
                </Form>
                <ListModelDetail getTableData={this.getListModelDetailData} ref='listModelDetail' />
            </div>
        );
    }
}

export default Form.create()(WorkAreaForm);
